<template>
    <!-- 修改对话框 -->
    <el-dialog
        title="修改权限"
        :visible.sync="dialogVisible"
        width="700px"
    >
        <el-form ref="form" :model="form" label-width="120px" size="small">
            <el-form-item label="权限名称">
                <el-input v-model="form.name"></el-input>
            </el-form-item>
            <el-form-item label="路径">
                <el-input v-model="form.path"></el-input>
            </el-form-item>
            <el-form-item label="code">
                <el-input v-model="form.code"></el-input>
            </el-form-item>
            <el-form-item label="隐藏">
                <el-input v-model="form.hidden"></el-input>
            </el-form-item>
            <el-form-item label="level" prop="hidden">
                <el-input v-model="form.level"></el-input>
            </el-form-item>
            <el-form-item label="重定向">
                <el-input v-model="form.redirect"></el-input>
            </el-form-item>
            <el-form-item label="组件">
                <el-input type="textarea" v-model="form.component" :rows="2"></el-input>
            </el-form-item>
            <el-form-item label="显示">
                <el-input v-model="form.alwaysShow"></el-input>
            </el-form-item>
            <el-form-item label="meta">
                <el-input v-model="form.meta"></el-input>
            </el-form-item>
            <el-form-item label="备注">
                <el-input type="textarea" v-model="form.remark" :rows="2"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" size="small" @click="onSubmit('form')"
                >保存
                </el-button
                >
                <el-button @click="dialogVisible = false">取消</el-button>
            </el-form-item>
        </el-form>
    </el-dialog>
</template>

<script>
import {upDatePermit} from "@/admin/api/admin/backStage/permit/permit";

export default {
    data() {
        return {
            dialogVisible: false,
            form: {
                name: "", // 英文名称
                id: 0,
                path: "",
                code: "",
                hidden: 0,
                level: '',
                redirect: "",
                component: "../views/index/set/account/permit/createPermit.vue", //必填
                alwaysShow: "true",
                meta: "{requiresAuth:true}", // 必填{"title";"xxx","icon":"xxx",link:"xxx"}
                remark: "",
            },
        };
    },
    methods: {
        // 显示弹出窗口
        showDialog(row) {
            this.form = {
                ...row,
                alwaysShow: JSON.stringify(row.alwaysShow),
            };

            this.dialogVisible = true;
        },
        onSubmit(form) {
            this.form.level = JSON.parse(this.form.level);
            this.$refs[form].validate((valid) => {
                if (valid) {
                    upDatePermit(this.form, this.form.id).then((res) => {
                        // console.log(res)
                        if (res.code == 200) {
                            this.dialogVisible = false;
                            this.$refs["form"].resetFields();
                            this.$message({
                                message: res.message,
                                type: "success",
                            });
                            this.$parent.getData();
                        } else {
                            this.$message({
                                message: res.message,
                                type: "error",
                            });
                        }
                    });
                } else {
                    return false;
                }
            });
        }
    }
};
</script>


<style lang="less" scoped>
</style>
